<!-- subpkg_consult/description/description -->
<script lang="ts" setup>
import { uploadImgApi } from '@/api/consult';
import { ref } from 'vue';

// 病情描述数据
const illnessInfo = ref({
  illnessDesc: '',
  illnessTime: 1,
  consultFlag: 1
})
// 病情时间列表
const illnessTimeList = [
  { id: 1, name: '一周内' },
  { id: 2, name: '一月内' },
  { id: 3, name: '半年内' },
  { id: 4, name: '大于半年' }
]
// 就诊情况列表
const consultFlagList = [
  { id: 1, name: '就诊过' },
  { id: 0, name: '未就诊过' }
]

//处理图片上传
const onUpload = async (e: UniHelper.UniFilePickerOnSelectEvent) => {
  const res = await uploadImgApi(e.tempFilePaths[0])

}


</script>

<template>
  <scroll-view>
    <view class="description-page">
      <!-- 在线医生 -->
      <view class="doctor-online">
        <image src="/static/uploads/doctor-avatar-2.png" class="doctor-avatar" />
        <view class="doctor-info">
          <view class="name">在线医生</view>
          <view class="message">
            请描述你的疾病或症状、是否用药、就诊经历，需要我听过什么样的帮助
          </view>
          <view class="tips">
            <text class="iconfont icon-shield"></text>
            内容仅医生可见
          </view>
        </view>
      </view>
      <!-- 患者信息 -->
      <view class="patient-info">
        <view class="description">
          <uni-easyinput type="textarea" :input-border="false" v-model="illnessInfo.illnessDesc"
            placeholder-style="font-size: 30rpx; color: #979797" placeholder="请详细描述您的病情,病情描述不能为空" />
        </view>

        <view class="title">本次患病多久了？</view>
        <view class="tags">
          <text class="tag" @click="illnessInfo.illnessTime = item.id" v-for="(item, index) in illnessTimeList"
            :class="{ active: item.id === illnessInfo.illnessTime }">{{ item.name }}</text>
        </view>

        <view class="title">此次病情是否去医院就诊过？</view>
        <view class="tags">
          <text class="tag" v-for="(item, index) in consultFlagList"
            :class="{ active: illnessInfo.consultFlag == item.id }" @click="illnessInfo.consultFlag = item.id">{{
              item.name }}</text>
        </view>
      </view>
      <!-- 上传图片 -->
      <view class="patient-picture">
        <uni-file-picker title="上传病情相关图片 (仅医生可见)" limit="8" :image-styles="{ width: '160rpx', height: '160rpx' }"
          file-extname="png,jpg,gif,webp" @select="onUpload" />
      </view>
    </view>
    <!-- 下一步操作 -->
    <view class="next-step">
      <button class="uni-button">下一步</button>
    </view>
  </scroll-view>
</template>

<style lang="scss">
@import 'description.scss';
</style>